<template>
	<div class="back_contain_n">
		<!-- 头部搜索 -->
		<div class="Search_Top_Part">
			<div class="search_list">
				<div>
					<div class="input_flex">
						<el-select clearable v-model="queryForm.storageType" placeholder="入库类型">
							<el-option label="生产" value="1"></el-option>
							<el-option label="整理" value="2"></el-option>
						</el-select>
					</div>
					<div class="input_flex">
						<el-input clearable v-model="queryForm.storageCode" placeholder="入库号"></el-input>
					</div>
					<div class="input_flex">
						<el-select class="_right" clearable v-model="queryForm.name" placeholder="入库人">
							<el-option v-for="(item,index) in userList" :key="index" :label="item.userName"
									   :value="item.userName"/>
						</el-select>
					</div>
					<div class="input_flex daterange">
						<el-date-picker v-model="time" type="daterange"
										range-separator="-"
										start-placeholder="开始日期"
										end-placeholder="结束日期">
						</el-date-picker>
					</div>
				</div>
			</div>
			<div class="search_bt">
				<span class="zll-search" @click="getList">搜索</span>
				<span class="zll-search-reset" @click="searchReset()">重置</span>
			</div>
		</div>
		<!-- table -->
		<sys-table
			ref="systable"
			:isMultipleSelection="false"
			:tableData="tableData"
			:tableLoading="tableLoading"
			:tableHeader="tableHeader"
			:scopeWidth="120"
			:backCount="backCount"
			@getBackData="getList"
		>
			<template slot-scope="scope" slot="operate">
				<el-button @click="edit(scope.row,'see')" type="text" size="small">查看</el-button>
			</template>
		</sys-table>
		<div class="zll-dialog">
			<popout :title="type == 'edit'?'成品待入库':(type =='see'?'成品入库记录':'')" :visible.sync="addDialog"
					v-if="addDialog" class="bg_Size">
				<add ref="add" slot="content" :editData="editData" :type="type"></add>
				<template slot="bottom">
					<p class="zll-botton Info" @click="addDialog = false">关 闭</p>
				</template>
			</popout>
		</div>
	</div>
</template>

<script>
	import {formatDate} from "@/plugins/formatDate";
	import Add from './add.vue'

	export default {
		data() {
			return {
				tableLoading: true, //table刷新
				type: '',
				editData: {},

				queryForm: {
					name: '',
					storageType: '',
					storageCode: '',
				},
				backCount: 0,
				tableData: [],
				tableHeader: [],
				addDialog: false,
				time: [],

				userList: [],
			}
		},
		methods: {
			getSelectUsers() {
				let self = this;
				self.userList = [];
				self.$http({
					url: "/jinl/login/getLoginSelectList",
					method: "post",
				}).then(resp => {
					if (resp.success) {
						self.userList = resp.result;
					}
				});
			},

			edit(val, type) {
				let self = this;
				self.addDialog = true;
				self.type = type;
				self.$nextTick(() => {
					self.editData = Object.assign({}, val);
				});
			},

			getList(startIndex, pageRow) {
				let self = this;
				if (this.time && this.time.length == 2) {
					//date类型
					self.queryForm.startTime = formatDate(new Date(self.time[0]), 'yyyy-MM-dd')
					self.queryForm.endTime = formatDate(new Date(self.time[1]), 'yyyy-MM-dd') + ' 23:59:59'
				} else {
					self.queryForm.startTime = '';
					self.queryForm.endTime = '';
				}

				let pageInfo = self.$refs.systable.getPageInfo(startIndex);
				if (pageInfo.pageNum == 0 || startIndex == 0) {
					self.$refs.systable.resetPage();
				}
				self.queryForm.startIndex = pageInfo.pageNum;
				self.queryForm.totalPage = pageInfo.pageSize;
				let param = Object.assign({}, self.queryForm);
				self.tableLoading = true;
				self.$http({
					url: "/jinl/productStorage/getProductStorageList",
					method: "post",
					params:param
				}).then(resp => {
					self.tableLoading = false;
					if (resp.success) {
						self.tableData = resp.result;
						self.tableHeader = [
							{"columnValue": "storageTypeCn", "columnName": "入库类型"},
							{"columnValue": "storageCode", "columnName": "入库号"},
							{"columnValue": "storageGradeCount", "columnName": "规格数量"},
							{"columnValue": "storageCount", "columnName": "入库件数"},
							{"columnValue": "storageStatusCn", "columnName": "状态"},
							{"columnValue": "createTimeFt", "columnName": "入库日期"},
							{"columnValue": "storageUserName", "columnName": "入库人"},
						];
						if (resp.result.length > 0) {
							self.backCount = resp.result[0].count;
						} else {
							self.backCount = 0;
						}
					}else {
						self.$message.error('获取列表异常！');
					}

				});

			},


			searchReset() { //重置搜索
				this.queryForm = {
					userId: '',
					storageType: '',
					storageCode: '',
				};
				this.time = [];
				this.getList();
			},
		},
		mounted() {
			let self = this;
			self.getSelectUsers()
			self.getList()
		},

		components: {Add},
	}
</script>

<style lang="scss" scoped>
	@import "@/style/SearchTop.scss";
</style>